<template>
  <div class="login-container">
    <p style="margin-top: 30px">用户名:<input v-model="username" /></p>
    <p style="margin-top: 30px">密码:<input v-model.number="password" /></p>
    <p style="margin-top: 30px">
      <button @click="onLogin">登录</button>
    </p>
  </div>
</template>

<script>
// 高耦合
// import axios from 'axios'
import { login } from '../../api/user'
export default {
  data () {
    return {
      username: '17704051019',
      password: '123456'
    }
  },
  methods: {
    async onLogin () {
      const res = await login({
        loginname: this.username,
        password: this.password
      })

      console.log('---res---', res)
      /**
      const res = await axios.post(
        'https://huangjiangjun.top:3002/api/user/login',
        { loginname: this.username, password: this.password }
      )

      console.log('---res---', res)
       */
      /**
      if (this.username === 'admin' && this.password === 123) {
        // console.log('----')
        this.$router.push('/layout')
      } else {
        alert('用户名或密码错误')
      }
       */
    }
  }
}
</script>

<style scoped>
.login-container {
  width: 300px;
  height: 200px;
  border: 1px solid #e3f3e3;
  margin: 200px auto;
  text-align: center;
}
</style>
